<template>
  <div id="jobMineList">
    <!--上部搜索条件组件-->
    <topSearch :form-inline="formInline" @toSearch="toSearch"></topSearch>
    <div class="table-conBtn">
      <el-button
        v-permission="'wh:system:homeRelease:addJob'"
        type="warning"
        @click="showPubJob()"
      >
        发布作业
      </el-button>
      <el-button
        v-permission="'wh:system:homeRelease:deleteAll'"
        :disabled="searchDelStatus === 'Y'"
        type="warning"
        plain
        @click="delAll()"
      >
        批量删除
      </el-button>
      <freshCom @searchList="searchList"></freshCom>
    </div>
    <!--全选-->
    <el-checkbox
      v-model="checkAll"
      class="topCheck"
      :indeterminate="isIndeterminate"
      :disabled="searchDelStatus === 'Y'"
      @change="handleCheckAllChange"
    ></el-checkbox>
    <div v-if="loading" v-loading="loading"></div>
    <p v-if="tableData.length === 0 && !loading" class="no-data">
      暂无数据！
    </p>
    <div class="container" ref="container">
      <el-checkbox-group
        v-if="tableData.length > 0 && !loading"
        v-model="multipleSelection"
        v-loading="loading"
        @change="checkChange"
      >
        <div
          v-for="(item, index) in tableData"
          :key="item.jobcompletionId"
          class="line"
        >
          <div class="line-left">
            <el-checkbox
              :label="item.jobcompletionId"
              :disabled="item.delStatu === 'Y'"
            >
              {{ stance }}
            </el-checkbox>
          </div>
          <div class="line-right">
            <!--用户主要信息-->
            <userInfo
              ref="uInfo"
              :item="item"
              :labelList="labelList"
              :labelListTotal="labelListTotal"
              :index="index"
              from="jobMin"
              @refresh="refresh"
            >
              <template v-slot:infoTag>
                <!--机审状态-->
                <el-tag type="success" effect="dark">
                  {{
                    item.machineStatu ? machine(item.machineStatu) : '未审核'
                  }}
                </el-tag>
                <!--保利威审核状态-->
                <el-tag
                  v-if="item.polyvStatu === 'UNPASS'"
                  type="success"
                  effect="dark"
                >
                  保利威未通过
                </el-tag>
                <!--人审状态-->
                <el-tag type="success" effect="dark">
                  {{ item.checkStatu ? mnual(item.checkStatu) : '未审核' }}
                </el-tag>
              </template>
            </userInfo>
            <!--点赞、删除...按钮-->
            <userBtn
              v-if="showComment(item)"
              :item="item"
              :btn-num="btnNum"
              title="我的发布"
              :index="index"
              from="jobMin"
              @refresh="refresh"
              @showEdit="showEditJob"
            ></userBtn>
            <!--说点什么-->
            <template v-permission="'wh:system:homeRelease:addComment'">
              <userTalk
                v-if="showComment(item)"
                ref="userTalk"
                :item="item"
                title="我的发布"
                @refresh="refresh"
              ></userTalk>
            </template>
          </div>
        </div>
      </el-checkbox-group>
    </div>
    <!--分页-全局组件-->
    <jobPage
      :searchParams="searchParams"
      :tableData="tableData"
      @changePage="changePage"
    ></jobPage>
    <!--发布作业-->
    <dialogPubJob
      v-if="dialogPubJobData.isShow"
      :dialog-data="dialogPubJobData"
      @refresh="refresh"
    ></dialogPubJob>
    <!--编辑作业-->
    <dialogEditJob
      v-if="dialogEditJobData.isShow"
      :dialog-data="dialogEditJobData"
      @refresh="refresh"
    ></dialogEditJob>
    <!-- 删除弹窗 -->
    <delDialog
      v-if="delDialogData.isShow"
      :del-dialog-data="delDialogData"
      @reasonDel="reasonDel"
    ></delDialog>
  </div>
</template>

<script>
import { getMineList, delItem } from '@/api/jobManagement' // 接口
import topSearch from '@component/jobManagement/jobMine/topSearch' // 上部搜索条件
import userInfo from '@component/jobManagement/common/userInfo' // 用户主要信息
import userBtn from '@component/jobManagement/common/userBtn' // 点赞、删除...按钮
import userTalk from '@component/jobManagement/common/userTalk' // 说点什么
import dialogPubJob from '@component/jobManagement/jobMine/dialogPubJob' // 发布作业
import dialogEditJob from '@component/jobManagement/jobMine/dialogEditJob' // 编辑作业
import delDialog from '@component/common/delDialog' // 删除弹窗
import jobPage from '@common/jobPage'
import { saveScrollMixins } from '@/mixins/saveScroll'
import { jobWorkMixins } from '@/mixins/jobWork'
import { mapGetters } from 'vuex'
import { sysNormalDisable, getPraiseBtn } from '@utils/dictionariesFunc'
export default {
  name: 'publish',
  msg: '作业管理-我的发布-列表页',
  mixins: [saveScrollMixins, jobWorkMixins],
  components: {
    userInfo,
    userBtn,
    userTalk,
    topSearch,
    dialogPubJob,
    dialogEditJob,
    delDialog,
    jobPage
  },
  data() {
    return {
      total: 0,
      searchDelStatus: 'N',
      formInline: {
        // 搜索条件
        isRecommend: '', // 是否推荐
        categoryId: '', // 选择学院
        jobType: '', // 作业类型
        isTop: '', // 是否置顶
        order: '', // 排序规则
        level: '', // 作业打分
        isDel: '', // 删除状态
        courseType: '', // 课程类型
        courseLevel: '', // 课程等级
        checkStatu: '', // 人审结果
        machineStatu: '', // 机审结果
        identCode: '', // 作业码
        taskTitle: '', // 作业名称
        teacherName: '', // 讲师姓名
        timeType: '', // 时间规则
        startTime: '', // 开始时间
        endTime: '', // 结束时间
        createTime: []
      },
      dialogPubJobData: {
        // 发布作业
        isShow: false // 默认隐藏
      },
      dialogEditJobData: {
        // 编辑
        isShow: false, // 默认隐藏
        params: '' // 编辑时，传递的参数
      },
      powerStr: 'system:homeRelease:list' // 是否查询的标识
    }
  },
  computed: {
    ...mapGetters({
      machine: 'dictionaries/getMachineStatu', // 机审状态
      mnual: 'dictionaries/getCheckStatu' // 人审状态
    })
  },
  activated() {
    // 跳到滚动距离
    this.$nextTick(() => {
      this.toContainerScrollHeight()
    })
  },
  mounted() {
    this.getBtnList()
    // 获取权限
    // this.getPower()
    this.$nextTick(() => {
      // 监听滚动事件
      window.addEventListener('scroll', this.setContainerScrollHeight, true)
    })
  },
  methods: {
    /* 获取权限 */
    getPower() {
      let id = this.$route.query.mId
      this.getCurPageMenu(id).then((res) => {
        this.powerAry = res
        sessionStorage.setItem(`powerAry_${id}`, res)
        this.canShowPage = true
        if (!res.includes(this.powerStr)) {
          this.canGetList = false
          this.alertPower(this.powerStr)
        }
        this.getBtnList()
      })
    },
    /* 获取评论按钮列表 */
    async getTalkBtnList() {
      let data = await sysNormalDisable('sys_grade')
      for (let i = 0; i < this.tableData.length; i++) {
        this.$refs['userTalk'][i].getBtnList(data)
      }
    },
    /* 获取小手点赞数值 */
    async getBtnList() {
      if (!this.canGetList) return
      let str = await getPraiseBtn()
      this.btnNum = str.split(',')
    },
    /*是否显示评论点赞区域*/
    showComment(item) {
      let isHide =
        item.delStatu === 'Y' ||
        (item.machineStatu === 'UNPASS' && item.checkStatu === 'UNCHECKED') ||
        item.polyvStatu === 'UNPASS'
      return !isHide
    },
    /* 获取列表 */
    searchList() {
      if (!this.canGetList) return
      this.loading = true
      this.tableData = []
      this.total = 0
      let obj = Object.assign({}, this.searchParams, this.formInline)
      getMineList(
        obj,
        (response) => {
          this.loading = false
          this.tableData = response.rows
          this.total = response.total
          this.searchParams.xPaginationCount = response.total
          // 获取列表数据之后，遍历当前列表，获取全部id
          this.checkTableId()
          if (this.formInline.isDel === 'N') {
            //未删除状态获取小手点赞
            this.getTalkBtnList()
            this.searchDelStatus = 'N'
          } else {
            this.searchDelStatus = 'Y'
          }
        },
        (response) => {
          this.loading = false
          this.$message.warning(response.message)
        }
      )
    },
    // 删除请求
    reasonDel(res) {
      let type = this.delDialogData.type
      this.$confirm(`${type}理由：${res} 确认${type}该条信息？`, '系统提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let ids = []
        this.multipleSelection.forEach((item) => {
          ids.push(item)
        })
        let obj = { ids, reason: res }
        delItem(
          obj,
          (response) => {
            this.searchList()
            this.multipleSelection = []
            this.isIndeterminate = false
          },
          (response) => {
            this.$message.warning('删除失败，' + response.message)
          }
        )
        this.delDialogData.isShow = false
      })
    },
    /* 发布作业 */
    showPubJob() {
      this.dialogPubJobData.isShow = true
    },
    /* 编辑作业 */
    showEditJob(id) {
      this.dialogEditJobData.isShow = true
      this.dialogEditJobData.id = id
    }
  }
}
</script>

<style lang="less">
#jobMineList {
  .topCheck {
    margin-left: 30px;
  }

  .line {
    display: flex;
    justify-content: left;
    width: 100%;
    border-bottom: 1px solid #eee;
    padding: 25px 0 30px;

    .line-left {
      padding: 0 30px;
    }

    .line-right {
      flex: auto;
    }
  }
  p.no-data {
    line-height: 50px;
    text-align: center;
    font-size: 16px;
    color: #666;
  }
  .container {
    max-height: 490px;
    overflow-y: auto;
  }
}
</style>
